298. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2023-03-13 03:01:18 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

298.1 Files compared

#LocationFileLast Modified
1Porto v4.0.4/Porto Theme/app/design/frontend/Smartwave/porto/WeltPixel_Quickview/web/cssmagnific-popup.css2021-02-22 03:33:12 +0000
2Porto v4.0.5/Porto Theme/app/design/frontend/Smartwave/porto/WeltPixel_Quickview/web/cssmagnific-popup.css2022-12-30 03:06:41 +0000

298.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged3800
Changed24
Inserted00
Removed00

298.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

298.4 Active regular expressions

No regular expressions were active.

298.5 Comparison detail

1 /* Magnific Popup CSS */ 1 /* Magnific Popup CSS */
2 .mfp-bg { 2 .mfp-bg {
3   top: 0; 3   top: 0;
4   left: 0; 4   left: 0;
5   width: 100%; 5   width: 100%;
6   height: 100%; 6   height: 100%;
7   z-index: 1042; 7   z-index: 1042;
8   overflow: hidden; 8   overflow: hidden;
9   position: fixed; 9   position: fixed;
10   background: rgba(68,70,69,0.65); } 10   background: rgba(68,70,69,0.65); }
11  11 
12 .mfp-wrap { 12 .mfp-wrap {
13   top: 0; 13   top: 0;
14   left: 0; 14   left: 0;
15   width: 100%; 15   width: 100%;
16   height: 100%; 16   height: 100%;
17   z-index: 1043; 17   z-index: 1043;
18   position: fixed; 18   position: fixed;
19   outline: none !important; 19   outline: none !important;
20   -webkit-backface-visibility: hidden; } 20   -webkit-backface-visibility: hidden; }
21  21 
22 .mfp-container { 22 .mfp-container {
23   text-align: center; 23   text-align: center;
24   position: absolute; 24   position: absolute;
25   width: 100%; 25   width: 100%;
26   height: 100%; 26   height: 100%;
27   left: 0; 27   left: 0;
28   top: 0; 28   top: 0;
29   padding: 0 8px; 29   padding: 0 8px;
30   box-sizing: border-box; } 30   box-sizing: border-box; }
31  31 
32 .mfp-container:before { 32 .mfp-container:before {
33   content: ''; 33   content: '';
34   display: inline-block; 34   display: inline-block;
35   height: 100%; 35   height: 100%;
36   vertical-align: middle; } 36   vertical-align: middle; }
37  37 
38 .mfp-align-top .mfp-container:before { 38 .mfp-align-top .mfp-container:before {
39   display: none; } 39   display: none; }
40  40 
41 .mfp-content { 41 .mfp-content {
42   position: relative; 42   position: relative;
43   display: inline-block; 43   display: inline-block;
44   vertical-align: middle; 44   vertical-align: middle;
45   margin: 0 auto; 45   margin: 0 auto;
46   text-align: left; 46   text-align: left;
47   z-index: 1045; } 47   z-index: 1045; }
48  48 
49 .mfp-inline-holder .mfp-content, 49 .mfp-inline-holder .mfp-content,
50 .mfp-ajax-holder .mfp-content { 50 .mfp-ajax-holder .mfp-content {
51   width: 100%; 51   width: 100%;
52   cursor: auto; } 52   cursor: auto; }
53  53 
54 .mfp-ajax-cur { 54 .mfp-ajax-cur {
55   cursor: progress; } 55   cursor: progress; }
56  56 
57 .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { 57 .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
58   cursor: -moz-zoom-out; 58   cursor: -moz-zoom-out;
59   cursor: -webkit-zoom-out; 59   cursor: -webkit-zoom-out;
60   cursor: zoom-out; } 60   cursor: zoom-out; }
61  61 
62 .mfp-zoom { 62 .mfp-zoom {
63   cursor: pointer; 63   cursor: pointer;
64   cursor: -webkit-zoom-in; 64   cursor: -webkit-zoom-in;
65   cursor: -moz-zoom-in; 65   cursor: -moz-zoom-in;
66   cursor: zoom-in; } 66   cursor: zoom-in; }
67  67 
68 .mfp-auto-cursor .mfp-content { 68 .mfp-auto-cursor .mfp-content {
69   cursor: auto; } 69   cursor: auto; }
70  70 
71 .mfp-close, 71 .mfp-close,
72 .mfp-arrow, 72 .mfp-arrow,
73 .mfp-preloader, 73 .mfp-preloader,
74 .mfp-counter { 74 .mfp-counter {
75   -webkit-user-select: none; 75   -webkit-user-select: none;
76   -moz-user-select: none; 76   -moz-user-select: none;
77   user-select: none; } 77   user-select: none; }
78  78 
79 .mfp-loading.mfp-figure { 79 .mfp-loading.mfp-figure {
80   display: none; } 80   display: none; }
81  81 
82 .mfp-hide { 82 .mfp-hide {
83   display: none !important; } 83   display: none !important; }
84  84 
85 .mfp-preloader { 85 .mfp-preloader {
86   color: #CCC; 86   color: #CCC;
87   position: absolute; 87   position: absolute;
88   top: 50%; 88   top: 50%;
89   width: auto; 89   width: auto;
90   text-align: center; 90   text-align: center;
91   margin-top: -0.8em; 91   margin-top: -0.8em;
92   left: 8px; 92   left: 8px;
93   right: 8px; 93   right: 8px;
94   z-index: 1044; } 94   z-index: 1044; }
95   .mfp-preloader a { 95   .mfp-preloader a {
96     color: #CCC; } 96     color: #CCC; }
97     .mfp-preloader a:hover { 97     .mfp-preloader a:hover {
98       color: #FFF; } 98       color: #FFF; }
99  99 
100 .mfp-s-ready .mfp-preloader { 100 .mfp-s-ready .mfp-preloader {
101   display: none; } 101   display: none; }
102  102 
103 .mfp-s-error .mfp-content { 103 .mfp-s-error .mfp-content {
104   display: none; } 104   display: none; }
105  105 
106 button.mfp-close, 106 button.mfp-close,
107 button.mfp-arrow { 107 button.mfp-arrow {
108   overflow: visible; 108   overflow: visible;
109   cursor: pointer; 109   cursor: pointer;
110   background: transparent; 110   background: transparent;
111   border: 0; 111   border: 0;
112   -webkit-appearance: none; 112   -webkit-appearance: none;
113   display: block; 113   display: block;
114   outline: none; 114   outline: none;
115   padding: 0; 115   padding: 0;
116   z-index: 1046; 116   z-index: 1046;
117   box-shadow: none; 117   box-shadow: none;
118   touch-action: manipulation; } 118   touch-action: manipulation; }
119  119 
120 button::-moz-focus-inner { 120 button::-moz-focus-inner {
121   padding: 0; 121   padding: 0;
122   border: 0; } 122   border: 0; }
123  123 
124 .mfp-close { 124 .mfp-close {
125   width: 44px; 125   width: 44px;
126   height: 44px; 126   height: 44px;
127   line-height: 44px; 127   line-height: 44px;
128   position: absolute; 128   position: absolute;
129   right: 0; 129   right: 0;
130   top: 0; 130   top: 0;
131   text-decoration: none; 131   text-decoration: none;
132   text-align: center; 132   text-align: center;
133   opacity: 0.65; 133   opacity: 0.65;
134   padding: 0 0 18px 10px; 134   padding: 0 0 18px 10px;
135   color: #FFF; 135   color: #FFF;
136   font-style: normal; 136   font-style: normal;
137   font-size: 28px; 137   font-size: 28px;
138   font-family: Arial, Baskerville, monospace; } 138   font-family: Arial, Baskerville, monospace; }
139   .mfp-close:hover, 139   .mfp-close:hover,
140   .mfp-close:focus { 140   .mfp-close:focus {
141     opacity: 1; } 141     opacity: 1; }
142   .mfp-close:active { 142   .mfp-close:active {
143     top: 1px; } 143     top: 1px; }
144  144 
145 .mfp-close-btn-in .mfp-close { 145 .mfp-close-btn-in .mfp-close {
146   color: #838383; 146   color: #838383;
147 } 147 }
148  148 
149 .mfp-image-holder .mfp-close, 149 .mfp-image-holder .mfp-close,
150 .mfp-iframe-holder .mfp-close { 150 .mfp-iframe-holder .mfp-close {
151   right: 28px; 151   right: 18px;
152   text-align: right; 152   text-align: right;
153   padding-right: 6px; 153   padding-right: 6px;
154   width: 100%; } 154   width: 100%; }
155  155 
156 .mfp-counter { 156 .mfp-counter {
157   position: absolute; 157   position: absolute;
158   top: 0; 158   top: 0;
159   right: 0; 159   right: 0;
160   color: #CCC; 160   color: #CCC;
161   font-size: 12px; 161   font-size: 12px;
162   line-height: 18px; 162   line-height: 18px;
163   white-space: nowrap; } 163   white-space: nowrap; }
164  164 
165 .mfp-arrow { 165 .mfp-arrow {
166   position: absolute; 166   position: absolute;
167   opacity: 0.65; 167   opacity: 0.65;
168   margin: 0; 168   margin: 0;
169   top: 50%; 169   top: 50%;
170   margin-top: -55px; 170   margin-top: -55px;
171   padding: 0; 171   padding: 0;
172   width: 90px; 172   width: 90px;
173   height: 110px; 173   height: 110px;
174   -webkit-tap-highlight-color: transparent; } 174   -webkit-tap-highlight-color: transparent; }
175   .mfp-arrow:active { 175   .mfp-arrow:active {
176     margin-top: -54px; } 176     margin-top: -54px; }
177   .mfp-arrow:hover, 177   .mfp-arrow:hover,
178   .mfp-arrow:focus { 178   .mfp-arrow:focus {
179     opacity: 1; } 179     opacity: 1; }
180   .mfp-arrow:before, 180   .mfp-arrow:before,
181   .mfp-arrow:after { 181   .mfp-arrow:after {
182     content: ''; 182     content: '';
183     display: block; 183     display: block;
184     width: 0; 184     width: 0;
185     height: 0; 185     height: 0;
186     position: absolute; 186     position: absolute;
187     left: 0; 187     left: 0;
188     top: 0; 188     top: 0;
189     margin-top: 35px; 189     margin-top: 35px;
190     margin-left: 35px; 190     margin-left: 35px;
191     border: medium inset transparent; } 191     border: medium inset transparent; }
192   .mfp-arrow:after { 192   .mfp-arrow:after {
193     border-top-width: 13px; 193     border-top-width: 13px;
194     border-bottom-width: 13px; 194     border-bottom-width: 13px;
195     top: 8px; } 195     top: 8px; }
196   .mfp-arrow:before { 196   .mfp-arrow:before {
197     border-top-width: 21px; 197     border-top-width: 21px;
198     border-bottom-width: 21px; 198     border-bottom-width: 21px;
199     opacity: 0.7; } 199     opacity: 0.7; }
200  200 
201 .mfp-arrow-left { 201 .mfp-arrow-left {
202   left: 0; } 202   left: 0; }
203   .mfp-arrow-left:after { 203   .mfp-arrow-left:after {
204     border-right: 17px solid #FFF; 204     border-right: 17px solid #FFF;
205     margin-left: 31px; } 205     margin-left: 31px; }
206   .mfp-arrow-left:before { 206   .mfp-arrow-left:before {
207     margin-left: 25px; 207     margin-left: 25px;
208     border-right: 27px solid #3F3F3F; } 208     border-right: 27px solid #3F3F3F; }
209  209 
210 .mfp-arrow-right { 210 .mfp-arrow-right {
211   right: 0; } 211   right: 0; }
212   .mfp-arrow-right:after { 212   .mfp-arrow-right:after {
213     border-left: 17px solid #FFF; 213     border-left: 17px solid #FFF;
214     margin-left: 39px; } 214     margin-left: 39px; }
215   .mfp-arrow-right:before { 215   .mfp-arrow-right:before {
216     border-left: 27px solid #3F3F3F; } 216     border-left: 27px solid #3F3F3F; }
217  217 
218 .mfp-iframe-holder { 218 .mfp-iframe-holder {
219   padding-top: 40px; 219   padding-top: 40px;
220   padding-bottom: 40px; } 220   padding-bottom: 40px; }
221   .mfp-iframe-holder .mfp-content { 221   .mfp-iframe-holder .mfp-content {
222     line-height: 0; 222     line-height: 0;
223     width: 200px; 223     width: 200px;
224     max-width: 900px; } 224     max-width: 900px; }
225   .mfp-iframe-holder .mfp-close { 225   .mfp-iframe-holder .mfp-close {
226     top: -13px; 226     top: -6px;
227     width: auto; 227     width: auto;
228     font-size: 0; 228     font-size: 0;
229   } 229   }
230 .mfp-iframe-holder .mfp-close:hover { 230 .mfp-iframe-holder .mfp-close:hover {
231     background: transparent; 231     background: transparent;
232 } 232 }
233  233 
234 .mfp-iframe-scaler { 234 .mfp-iframe-scaler {
235   width: 100%; 235   width: 100%;
236   height: 0; 236   height: 0;
237   overflow: hidden; 237   overflow: hidden;
238   padding-top: 64.25%; } 238   padding-top: 64.25%; }
239   .mfp-iframe-scaler iframe { 239   .mfp-iframe-scaler iframe {
240     position: absolute; 240     position: absolute;
241     display: block; 241     display: block;
242     top: 0; 242     top: 0;
243     left: 0; 243     left: 0;
244     width: 100%; 244     width: 100%;
245     height: 100%; 245     height: 100%;
246     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); 246     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
247     opacity: 0; 247     opacity: 0;
248     background: #000; } 248     background: #000; }
249  249 
250 /* Main image in popup */ 250 /* Main image in popup */
251 img.mfp-img { 251 img.mfp-img {
252   width: auto; 252   width: auto;
253   max-width: 100%; 253   max-width: 100%;
254   height: auto; 254   height: auto;
255   display: block; 255   display: block;
256   line-height: 0; 256   line-height: 0;
257   box-sizing: border-box; 257   box-sizing: border-box;
258   padding: 40px 0 40px; 258   padding: 40px 0 40px;
259   margin: 0 auto; } 259   margin: 0 auto; }
260  260 
261 /* The shadow behind the image */ 261 /* The shadow behind the image */
262 .mfp-figure { 262 .mfp-figure {
263   line-height: 0; } 263   line-height: 0; }
264   .mfp-figure:after { 264   .mfp-figure:after {
265     content: ''; 265     content: '';
266     position: absolute; 266     position: absolute;
267     left: 0; 267     left: 0;
268     top: 40px; 268     top: 40px;
269     bottom: 40px; 269     bottom: 40px;
270     display: block; 270     display: block;
271     right: 0; 271     right: 0;
272     width: auto; 272     width: auto;
273     height: auto; 273     height: auto;
274     z-index: -1; 274     z-index: -1;
275     box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); 275     box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
276     background: #444; } 276     background: #444; }
277   .mfp-figure small { 277   .mfp-figure small {
278     color: #BDBDBD; 278     color: #BDBDBD;
279     display: block; 279     display: block;
280     font-size: 12px; 280     font-size: 12px;
281     line-height: 14px; } 281     line-height: 14px; }
282   .mfp-figure figure { 282   .mfp-figure figure {
283     margin: 0; } 283     margin: 0; }
284  284 
285 .mfp-bottom-bar { 285 .mfp-bottom-bar {
286   margin-top: -36px; 286   margin-top: -36px;
287   position: absolute; 287   position: absolute;
288   top: 100%; 288   top: 100%;
289   left: 0; 289   left: 0;
290   width: 100%; 290   width: 100%;
291   cursor: auto; } 291   cursor: auto; }
292  292 
293 .mfp-title { 293 .mfp-title {
294   text-align: left; 294   text-align: left;
295   line-height: 18px; 295   line-height: 18px;
296   color: #F3F3F3; 296   color: #F3F3F3;
297   word-wrap: break-word; 297   word-wrap: break-word;
298   padding-right: 36px; } 298   padding-right: 36px; }
299  299 
300 .mfp-image-holder .mfp-content { 300 .mfp-image-holder .mfp-content {
301   max-width: 100%; } 301   max-width: 100%; }
302  302 
303 .mfp-gallery .mfp-image-holder .mfp-figure { 303 .mfp-gallery .mfp-image-holder .mfp-figure {
304   cursor: pointer; } 304   cursor: pointer; }
305  305 
306 @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { 306 @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
307   /** 307   /**
308        * Remove all paddings around the image on small screen 308        * Remove all paddings around the image on small screen
309        */ 309        */
310   .mfp-img-mobile .mfp-image-holder { 310   .mfp-img-mobile .mfp-image-holder {
311     padding-left: 0; 311     padding-left: 0;
312     padding-right: 0; } 312     padding-right: 0; }
313   .mfp-img-mobile img.mfp-img { 313   .mfp-img-mobile img.mfp-img {
314     padding: 0; } 314     padding: 0; }
315   .mfp-img-mobile .mfp-figure:after { 315   .mfp-img-mobile .mfp-figure:after {
316     top: 0; 316     top: 0;
317     bottom: 0; } 317     bottom: 0; }
318   .mfp-img-mobile .mfp-figure small { 318   .mfp-img-mobile .mfp-figure small {
319     display: inline; 319     display: inline;
320     margin-left: 5px; } 320     margin-left: 5px; }
321   .mfp-img-mobile .mfp-bottom-bar { 321   .mfp-img-mobile .mfp-bottom-bar {
322     background: rgba(0, 0, 0, 0.6); 322     background: rgba(0, 0, 0, 0.6);
323     bottom: 0; 323     bottom: 0;
324     margin: 0; 324     margin: 0;
325     top: auto; 325     top: auto;
326     padding: 3px 5px; 326     padding: 3px 5px;
327     position: fixed; 327     position: fixed;
328     box-sizing: border-box; } 328     box-sizing: border-box; }
329     .mfp-img-mobile .mfp-bottom-bar:empty { 329     .mfp-img-mobile .mfp-bottom-bar:empty {
330       padding: 0; } 330       padding: 0; }
331   .mfp-img-mobile .mfp-counter { 331   .mfp-img-mobile .mfp-counter {
332     right: 5px; 332     right: 5px;
333     top: 3px; } 333     top: 3px; }
334   .mfp-img-mobile .mfp-close { 334   .mfp-img-mobile .mfp-close {
335     top: 0; 335     top: 0;
336     right: 0; 336     right: 0;
337     width: 35px; 337     width: 35px;
338     height: 35px; 338     height: 35px;
339     line-height: 35px; 339     line-height: 35px;
340     background: rgba(0, 0, 0, 0.6); 340     background: rgba(0, 0, 0, 0.6);
341     position: fixed; 341     position: fixed;
342     text-align: center; 342     text-align: center;
343     padding: 0; } } 343     padding: 0; } }
344  344 
345 @media all and (max-width: 900px) { 345 @media all and (max-width: 900px) {
346   .mfp-arrow { 346   .mfp-arrow {
347     -webkit-transform: scale(0.75); 347     -webkit-transform: scale(0.75);
348     transform: scale(0.75); } 348     transform: scale(0.75); }
349   .mfp-arrow-left { 349   .mfp-arrow-left {
350     -webkit-transform-origin: 0; 350     -webkit-transform-origin: 0;
351     transform-origin: 0; } 351     transform-origin: 0; }
352   .mfp-arrow-right { 352   .mfp-arrow-right {
353     -webkit-transform-origin: 100%; 353     -webkit-transform-origin: 100%;
354     transform-origin: 100%; } 354     transform-origin: 100%; }
355   .mfp-container { 355   .mfp-container {
356     padding-left: 6px; 356     padding-left: 6px;
357     padding-right: 6px; } } 357     padding-right: 6px; } }
358  358 
359  359 
360 .mfp-preloader { 360 .mfp-preloader {
361     z-index: 99999; 361     z-index: 99999;
362     content: ""; 362     content: "";
363     border: 2px solid transparent; 363     border: 2px solid transparent;
364     border-top-color: #08c; 364     border-top-color: #08c;
365     width: 40px; 365     width: 40px;
366     height: 40px; 366     height: 40px;
367     -webkit-animation: spin 0.75s infinite linear; 367     -webkit-animation: spin 0.75s infinite linear;
368     animation: spin 0.75s infinite linear; 368     animation: spin 0.75s infinite linear;
369     display: inline-block; 369     display: inline-block;
370     border-image: none; 370     border-image: none;
371     border-radius: 50%; 371     border-radius: 50%;
372     vertical-align: middle; 372     vertical-align: middle;
373     position: absolute; 373     position: absolute;
374     margin: auto; 374     margin: auto;
375     left: 0; 375     left: 0;
376     right: 0; 376     right: 0;
377     top: 0; 377     top: 0;
378     bottom: 0; 378     bottom: 0;
379 } 379 }
380 .mfp-preloader:before { 380 .mfp-preloader:before {
381     content: ''; 381     content: '';
382     position: absolute; 382     position: absolute;
383     left: -2px; 383     left: -2px;
384     top: -2px; 384     top: -2px;
385     width: inherit; 385     width: inherit;
386     height: inherit; 386     height: inherit;
387     border: inherit; 387     border: inherit;
388     border-radius: inherit; 388     border-radius: inherit;
389     border-top-color: inherit; 389     border-top-color: inherit;
390     animation: spin 1.5s infinite; 390     animation: spin 1.5s infinite;
391 } 391 }
392 @-webkit-keyframes rotateplane { 392 @-webkit-keyframes rotateplane {
393   0% { -webkit-transform: perspective(120px) } 393   0% { -webkit-transform: perspective(120px) }
394   50% { -webkit-transform: perspective(120px) rotateY(180deg) } 394   50% { -webkit-transform: perspective(120px) rotateY(180deg) }
395   100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) } 395   100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
396 } 396 }
397  397 
398 @keyframes rotateplane { 398 @keyframes rotateplane {
399   0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg) } 399   0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg) }
400   50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) } 400   50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) }
401   100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) } 401   100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) }
402 } 402 }

Araxis Merge (but not the data content of this report) is Copyright © 1993–2019 Araxis Ltd (www.araxis.com). All rights reserved.